@charset "utf-8";
canvas{position:absolute; margin-top:-1000em;}

.mobtop{ color:#FFF; line-height:1.6; position:relative; text-align:center; width:100%; height:auto; overflow:hidden;}
.mobtop .img{ width:100%; height:auto; vertical-align:middle; position:relative;}
.content{ position:absolute; width:100%; height:100%; top:0; left:0;}
.mobtop .container{ width:1200px; height:100%; position:relative; margin:0 auto;}
.mobtop .contentinfo{ width:1200px;position:absolute; top:50%; margin-top:-100px; text-align:center; z-index:1; overflow:hidden; left:0;}
.mobtop h2{color:#FFF; font-size:68px; font-weight:bold;  }
.mobtop i{font-size:140px;font-family: "Junlan"; line-height:1;}
.mobtop p{font-size:24px;}
.mobtop em{ display:block; width:15%; margin:0 auto; height:2em; display:none; border-bottom:1px solid #FFF;}
.mobtop .mob_logo{ display:block; width:120px; height:64px;background:url(m_logo.png) no-repeat left; position:absolute; right:60px; top:20px; z-index:10; background-size:100% auto;}
.mobtop .mob_nav{  height:64px; position:absolute; left:50px; top:15px; line-height:64px; font-size:18px;z-index:10;color:#FFF;}
.mobtop .mob_nav a{  font-size:18px; padding:0 20px; display:inline; colcase-titleor:#FFF; color:#FFF;}
.mobtop .mob_nav a:hover{ color:#FF0;}
.wapNavBtn{display:none;position:absolute; left:3%; top:10px; width:60px; height:32px;cursor:pointer; background:url("../images/wapnavbtn.png") no-repeat center; background-size:100% 100%; border:none; z-index:10}

.bottom1{ background:#FFF; width:100%;}
.bottom1 .p1{ color:#2E2E2E; font-size:32px; padding-top:50px; padding-bottom:20px;}
.bottom1 .p2{ color:#999; padding:30px 0 50px 0;}
.bottom1 input{ padding-left:1%; margin-right:1%;}
.bottom1 .input1{ background-color:#F0F0F0; border:none; width:17%; height:59px; line-height:59px; font-size:16px; color:#333;}
.bottom1 .input2{ background-color:#F0F0F0; border:none; width:47%; height:59px; line-height:59px; font-size:16px; color:#333;}
.bottom1 .submit{background-color:#0078D7; border:none; width:15%; height:59px; line-height:59px; font-size:16px; color:#FFF; cursor:pointer;}
.bottom1 .submit:hover {
	color:#FFF;
	background:#49D160;
}

.bottom2 a{ color:#FFF;}
.bottom2 a:hover{ text-decoration:underline;}
.bottom2{ width:100%; background-color:#111; color:#FFF; line-height:1.8}
.bottom2 ul li{ float:left; width:33%;}
.bottom2 h3{ font-size:20px; font-weight:normal; padding-bottom:20px; padding-top:50px;}
.bottom2 p{ font-size:16px;}
.bottom2 span{ font-size:12px; display:block;}
.bottom2 .fukuan{ width:160px; height:43px; background-color:#0078D7;line-height:43px; font-size:14px; text-align:center; margin-top:15px; }
.bottom2 .fukuan:hover {
	color:#FFF;
	background:#49D160;
	text-decoration:none;
}

.bottom2 .tell{ font-size:32px; line-height:1;}
.bottom2 .qq3{ padding-top:10px;}
.bottom2 .qq1{ background:url(../images/qq.png) no-repeat; width:55px; height:55px; display:inline-block; margin-top:50px; margin-right:10px;}
.bottom2 .qq2{ background:url(../images/qq2.png) no-repeat; width:55px; height:55px; display:inline-block; margin-top:50px;}
.bottom2 .xx{ padding-top:50px; padding-bottom:60px; font-size:12px;color:#BABABA;}
.bottom2 .xx .xx1{ float:left;}
.bottom2 .xx .xx2{ float:right;}

.ct9,a.ct9,.ct9 a,.ct9 a:visited{ color:#BABABA;}
a.ct9:hover,.ct9 a:hover{ color:#999;}

.btnmore {
	background: #0181EC;
	width: 270px;
	line-height:50px;
	text-align: center;
	margin: 20px auto;
	color: #FFF;
	display:block;
	font-size: 16px;
	border-left:0px;
	border-top:0px;
}
.btnmore:hover {
	color:#FFF;
	background:#49D160;
}

/*案例--------------*/
.case-title{padding-top: 40px;padding-bottom: 40px;}
.case-content li a{display: block;}
.case-content .hd{margin-top: 30px; min-height: 40px; font-size:16px;}
.case-content .hd span{margin-right: 20px;}
.case-content .pic img{width: 400px; height:300px; display:block; border:5px solid #EDEDEB; padding:20px; }


.case-title {margin-right:30px; color:#333; font-size:30px; font-weight:bold}
.case-title i{display: inline-block; margin-left: 10px; vertical-align: middle; width: 7px;height: 7px;background:url("../images/news_atr.png") no-repeat center; }
.case-title a{margin-right:30px; color:#333; font-size:16px; }
.case-title a:hover{color:#141414;}
.case-title a.hover i{background:url("../images/index_atr.png") no-repeat center top;}

.case-loading{ text-align:center; margin:0 0 50px; width:100%;display:none;}

.caseinfo{ background:#FFF;
/*
border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -o-border-radius:10px;-khtml-border-radius:10px; 
*/
position:relative; z-index:10; width:1060px; margin:-120px auto 25px;}
#target-image div{ text-align:center;}
.caseinfo img{ max-width:100%; text-align:center;display:inherit;}
.caseinfo .btnmore {
	width: 210px;
}

.caseinfotop1{ width:65%; padding-left:5%; padding-right:15%;}
.caseinfotop2{ width:35%;}
.caseinfotop i{ font-size:30px;font-family: "Junlan"; padding-top:50px; display:block; }
.caseinfotop p{ font-size:16px; color:#333; padding: 10px 0 10px;}
.caseinfotop span{ padding-top:20px; display:block;}
.caseinfotop .fangwen{display:inline-block; width:176px; height:34px; background:url("../images/s1_r2_c2.jpg") no-repeat; background-size:100% 100%; margin-top:10px;}
.caseinfobot a{ color:#444;}
.caseinfobot ul li{ float:left; width:33%;}
.caseinfobot ul li a:hover{ color:#0078D7;}
.caseinfobot ul li:nth-of-type(1){ text-align:left; padding-left:5%; padding-top:50px; }
.caseinfobot ul li:nth-of-type(2){ text-align:center; padding-top:30px;padding-bottom:30px;}
.caseinfobot ul li:nth-of-type(3){ text-align:right; padding-right:5%; padding-top:50px;}
.caseinfobot .fanhui a{ display:inline-block; width:65px; height:65px; background:url("../images/liebiao.png") no-repeat 0 0;}
.caseinfobot .fanhui a:hover{ background-position:0 -65px;}
.zi{ color:#BBB; margin-bottom:60px; line-height:1.5; font-size:12px;}

/***首页***/
	.fp-tableCell {
		position:relative;
	    width: 100%;
	    height: 100%;
	}
	.fp-tableCell #myVideo {
	    background-color: black;
	    background-position: center center;
	    background-size: contain;
	    bottom: 0;
	    height: 100%;
	    object-fit: cover;
	    position: absolute;
	    right: 0;
	    top: 0;
	    width: 100%;
	    z-index: 3;
	}
	.fp-tableCell .container {
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		max-width: 100%;
		height: 100%;
		z-index: 4;
	}
	.fp-tableCell h1 {
		position: absolute;
		visibility: hidden;
	}		
	.fp-tableCell .glitch-box {
		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		top: 50%;
		height: 170px;
		margin-top: -85px;
	}
	.fp-tableCell .glitch-box h4{
		font-size:120px;
		font-family:"Junlan";
		line-height:1;
	}
	.fp-tableCell .glitch-box h3{
		font-size:50px;
		font-weight:bold;
	}
	.fp-tableCell .glitch-box h5{
		font-size:16px;
	}
.mobtop #home_mbbg{display:none;}

#about_howto {
	padding:5px 0;
	color:#1a1a1a;
}
#about_howto li{
	display:none;
	line-height:1.3;
}
#about_howto {
	font-size:28px;
}
#about_howto .howto_en{
	font-size:16px;
}
.Junlan{font-size:102px; line-height:0.8;letter-spacing:8px; padding:50px 0 30px; color:#0181EC; font-family:Junlan,arial,Helvetica;}



/**********side-bar***********/

.side-bar{position:fixed;bottom:300px;right:0px;margin-right:-100px;width:45px;z-index:10000;font-size:14px; display:none1;}.side-bar div{margin:1px 0 0;float:right;cursor:pointer;}.side-bar div p{color:#fff;line-height:45px;}.side-bar div a{ display:block; width:110px;}.to-top{width:45px;height:45px;line-height:45px;text-align:center;background:#cbcbcb;color:#fff;font-weight:bold;position:relative;}
.side-bar strong{font-weight:bold;}
.side-bar-erweima{width:45px;height:45px;background:#888;position:relative;}
.erweima{width:390px;height:150px;display:none;position:absolute;top:-108px;left:-405px;background:#fff;border:1px solid #ccc;float:right;cursor:default !important;}
.side-bar-erweima .erweima p{line-height:20px;color:#000;text-align:center;float:left;width:130px;}
.side-bar-erweima .erweima p.con{line-height:20px;font-size:14px;text-align:left;float:left;width:335px; padding:13px 10px 10px 15px;}
.ico2{background:url(../images/barico2.png) no-repeat;}
.side-bar-erweima .arrow3{width:6px;height:11px;display:block;background:url(../images/weixin-arrow.png) no-repeat;position:absolute;right:-6px;top:122px;}
.side-bar-erweima img{width:110px;height:110px;margin:10px 10px 0px 10px;}
.side-bar-qq{width:45px;height:45px;background:#007AFF;}
.side-bar-contact{width:45px;height:45px;background:#888;}
.side-bar .ico2{width:46px;height:46px;display:block;float:left;}
.side-bar .side-bar-erweima .ico2{float:right;}
.to-top .ico2{width:12px;height:5px;position:absolute;top:-5px;left:18px;}
.side-bar-erweima .ico2{background-position:-46px -46px;}
.side-bar-erweima .ico2{background-position:-138px -46px;}
.side-bar-qq .ico2{background-position:2px -46px;}
.side-bar-contact .ico2{background-position:-92px -46px;}
.to-top .ico2{background-position:-28px -2px;}


.serlist2 .serlist21 ul li{ width:25%; float:left; }
.serlist2 .serlist21 ul li img{ display:block;}
.serlist2 .serlist22 .serlist22l,.serlist2 .serlist22 .serlist22r{ width:50%; text-align:center; padding-top:50px; padding-bottom:50px;}
.mob_tit{ font-size:28px; line-height:1.5; text-align:center; padding:60px 0 0;}
.mob_list{ width:1055px; margin:0 auto; padding:20px 0 50px;}
.mob_list ul li{ float:left; padding:8px;}
.mob_list ul li a{ display:block; width:334px; height:637px; color:#333;background:url(../images/sj_bg.png) no-repeat left; text-align:center;}
.mob_list ul li a:hover{ background-position:-334px 0; color:#1D8DFA;}
.mob_list ul li a h2{ font-size:27px; padding-top:140px; margin-bottom:30px;}


.mshow{ display:none;}
.w100{ width:100%;}
/*home-con*/
.home-conp{ font-size:16px;width:80%;margin:0 auto; padding-top:25px; color:#333;}
.home-con{ width:94%; margin:0 auto; padding-bottom:50px;}
.home-con ul li img{ display:block;padding-left:50px; padding-top:45px; }
.home-con ul li p{ font-size:22px; padding-left:50px; padding-top:10px;}
.home-con ul li i{ font-size:12px; display:block;padding-left:50px; padding-bottom:40px; padding-right:50px;}
.home-con ul li{float:left; width:20%;-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.home-con ul li:hover{-webkit-transform:scale(1.10);-moz-transform:scale(1.10);-o-transform:scale(1.10);transform:scale(1.10);box-shadow: 0px 0px 15px rgba(0,0,0,0.2); z-index:100; color:#FFF;}
.home-con ul li a:hover{ color:#FFF;}
.home-con ul li:nth-of-type(1){ background:#FFB71F;}
.home-con ul li:nth-of-type(2){ background:#10AF5D;}
.home-con ul li:nth-of-type(3){ background:#5C259E;}
.home-con ul li:nth-of-type(4){ background:#0078D7;}
.home-con ul li:nth-of-type(5){ background:#FF5C26;}

.godown{ position:absolute; left:50%; margin-left:-22px; width:44px; bottom:6%; z-index:5; cursor:pointer;}
.godown:hover{ margin-bottom:-2px;}

@media only screen and (max-width:720px) and (min-width:0px){
	
	
	.wrap{padding:0 3%;}

	.home-conp{ padding-top:20px; }
	.home-con{  padding-bottom:20px;}
	.home-con ul li:nth-of-type(4){ display:none;}
	.home-con ul li{ float:left; width:50%;}
	.home-con ul li img{padding-left:20px; padding-top:20px;height:50px;}
	.home-con ul li p{ font-size:16px; padding-left:20px; padding-top:10px;}
	.home-con ul li i{ font-size:10px; padding-left:20px; padding-bottom:20px; padding-right:20px;}
}
@media only screen and (max-width:720px) and (min-width:0px){
	.side-bar{ bottom:1000em;}
	
	.fp-tableCell .glitch-box h4{
		font-size:50px;
	}
	.fp-tableCell .glitch-box h3{
		font-size:28px;
		font-weight:bold;
		padding:0 3%;
		line-height:1.2;
	}
	.fp-tableCell .glitch-box h3 span{
		display:block;
	}
	.fp-tableCell .glitch-box h5{
		font-size:10px;
	}
	
#about_howto {
	font-size:22px;
}
#about_howto .howto_en{
	font-size:12px;
}

	.Junlan{font-size:36px; padding:30px 0 15px;}
	.mhide{display:none;}
	.mshow{ display:block;}
}

@media only screen and (max-width:720px) and (min-width:0px){
.mobtop #myVideo{display:none;}
.mobtop #home_mbbg{display:block;}

	
.case-title{padding-top: 20px;padding-bottom: 20px;}
.case-title a{margin-right: 10px; font-size:12px;}
.case-content li{width: 49%; *width:44.95%!important; margin-right:2%;float: left;margin-bottom: 10px;}
.case-content li:nth-of-type(2n){margin-right: 0;}
.case-content .hd{margin-top: 8px; min-height:45px; font-size:12px;}
.case-content .italic{ display:block; font-size:8px;}

.case-content li:nth-of-type(1),.case-content li:nth-of-type(2),.case-content li:nth-of-type(3),.case-content li:nth-of-type(4),.case-content li:last-child{width: 100%; position:relative; overflow:visible;}


.mobtop .container{ width:100%;}
.mobtop .contentinfo{ width:100%; top:40%; margin-top:0; height:auto;}
.mobtop h2{ font-size:20px;}
.mobtop i{font-size:40px;}
.mobtop p{ display:none;}
.mobtop .mob_logo{ width:80px; height:42px;background-size:100% 100%;right:3%; top:10px;}
.home .mobtop .mob_logo{top:2%;}
.mobtop .mob_nav{ display:none}
.wapNavBtn{display:block; top:20px;}

.bottom1 .p1{ font-size:18px; padding-top:20px; padding-bottom:10px;}
.bottom1 .p2{ padding:10px 0 20px 0; font-size:10px}
.bottom1 .input1{width:99%; height:45px; line-height:45px; font-size:15px; margin-bottom:10px; padding:10px;}
.bottom1 .input2{ width:99%; height:45px; line-height:45px; font-size:15px; margin-bottom:10px; padding:10px;}
.bottom1 .submit{ width:99%; height:45px; line-height:45px; font-size:16px; padding:10px;}
.bottom2 ul li{ width:100%;}
.bottom2 h3{ font-size:28px; padding-bottom:0px; padding-top:20px; font-weight:bold;}
.bottom2 p{ font-size:14px;}
.bottom2 span{ font-size:10px;}
.bottom2 .fukuan{ display:none;}
.bottom2 .tell{ font-size:24px; color:#FFF; }
.bottom2 .qq3{ padding-top:10px;}
.bottom2 .qq1{ background-size:100% 100%; width:30px; height:30px;  margin-top:40px; margin-right:10px;}
.bottom2 .qq2{ background-size:100% 100%; width:30px; height:30px;  margin-top:40px; margin-right:10px;}
.bottom2 .xx{ padding-top:50px; padding-bottom:30px; font-size:10px; }
.bottom2 .xx .xx2{ float:left;}
.bottom2 .xx .ct9{ display:none;}

.caseinfo{margin-top:-15px; margin-bottom:20px; width:92%;}
.caseinfo h2{ padding:20px 5% 0 5%; font-size:20px; font-weight:bold;}
.caseinfo .blk40{ height:0px;}
.caseinfo .btnmore {width: 100%;}

.caseinfotop1{ width:100%; padding-left:5%; padding-right:5%;}
.caseinfotop2{ width:100%; padding-left:5%; padding-right:5%;}
.caseinfotop i{ font-size:20px; padding-top:10px; display:none;}
.caseinfotop p{ font-size:12px; padding:10px 0 10px;}
.caseinfotop span{ padding-top:10px; font-size:10px}

.caseinfotop .fangwen{width:88px; height:17px; margin-top:10px;}
.caseinfobot a{ color:#444;}
.caseinfobot ul li{ float:left; width:33%;}
.caseinfobot ul li:nth-of-type(1){ text-align:left; padding-left:5%; padding-top:35px; }
.caseinfobot ul li:nth-of-type(2){ text-align:center; padding-top:30px;padding-bottom:30px;}
.caseinfobot ul li:nth-of-type(3){ text-align:right; padding-right:5%; padding-top:35px;}
.caseinfobot .fanhui a{width:32px; height:32px; background-size:100% 200%;  }
.caseinfobot .fanhui a:hover{ background-position:0 -32px; background-size:100% 200%; }
.zi{ display:none;}
}

@media only screen and (min-width:720px){
.case-content li{width: 31.5%; *width:29.95%!important; margin-right: 2.75%;float: left;margin-bottom: 50px;}
.case-content li:nth-of-type(3n){margin-right: 0;}}

.service{ background:#FFF;position:relative; z-index:10; width:1180px; margin:-120px auto 30px;}
.service img{ max-width:100%;}
.service p{ font-size:30px; color:#333; width:75%; margin:0 auto; padding:80px 0 55px 0;}
.service-content .servicecon li{width: 100%; *width:99.95%!important;height:390px; overflow:hidden; }
.service-content .servicecon li a:hover img{-o-opacity:0.6;opacity:0.6;-moz-opacity:0.6;-ms-opacity:0.6;-webkit-opacity:0.6;filter:alpha(opacity=60);}
.service-content .servicecon li:nth-of-type(1){ background-color:#FFB71F;}
.service-content .servicecon li:nth-of-type(2){ background-color:#10AF5D;}
.service-content .servicecon li:nth-of-type(3){ background-color:#0078D7;}
.service-content .servicecon li:nth-of-type(4){ background-color:#C01C23;}
.service-content .servicecon li .service-col{ width:590px; height:390px;}
.service-content .servicecon li a{color:#FFF; text-align:center; display:block}
.service-content .servicecon li a h3{ font-size:39px; font-weight:normal; padding-top:120px;}
.service-content .servicecon li a span{ font-size:16px; display:block; line-height:1.8; padding-bottom:10px;}
.service .w1200 h2{ font-size:40px; font-style:normal; line-height:1;font-family: "Junlan"; }
@media only screen and (max-width:720px) and (min-width:0px){
.service{margin-top:-15px; margin-bottom:20px; width:92%;}
.service p{ font-size:14px; padding:30px 0 20px 0;}
.service-content .servicecon{ padding-bottom:20px;}
.service-content .servicecon li{width: 100%; *width:99.95%!important; height:100%; }
.service-content .servicecon li div{width: 100%; *width:99.95%!important; height:100%; float:none; }
.service-content .servicecon li a h3{ font-size:20px;  padding-top:100px;}
.service-content .servicecon li a span{ font-size:12px;padding-bottom:10px;}
.service-content .servicecon li a h4{  padding-bottom:100px;}
.service-content .servicecon li .service-col{ width: 100%; *width:99.95%!important;}
.service .w1200 h2{ font-size:20px; font-style:normal; line-height:1;font-family: "Junlan"; }
	}

@media only screen and (max-width:720px) and (min-width:0px){
	
	
	
.serlist2 .serlist21 ul li{ width:50%; }
.serlist2 .serlist22 .serlist22l,.serlist2 .serlist22 .serlist22r{ width:100%; padding-top:30px; padding-bottom:30px;}
.mob_tit{ font-size:20px; padding:30px 0 0; display:none}
.mob_list{ width:100%;  padding:10px 0 00px; display:none}
.mob_list ul li{ width:100%;}
.mob_list ul li a{ display:block; width:334px; height:637px; color:#333;background:url(../images/sj_bg.png) no-repeat left; text-align:center; margin:0 auto;}
.mob_list ul li a:hover{ background-position:-334px 0; color:#1D8DFA;}
.mob_list ul li a h2{ font-size:27px; padding-top:140px; margin-bottom:30px;}
}
.sj-sjcase{ width:370px; margin:0 auto; z-index:30;}	
.sj-sjcase img{width:100%; display:block;}
.sj{ background:url(../images/sj-bj.jpg) repeat; width:100%; height:980px;}
.sjl,.sjr{ width:50%; position:relative; color:#FFF;}
.sjl .sjtu{ margin-top:160px;}
.sj-top{ left:86px; top:165px; z-index:40;}
.sj-case{ left:80px; top:90px; z-index:5;}
.sjr{padding-top:240px; padding-left:50px;line-height:1.2}
.sjr .title{ font-size:42px; padding-right:50px;}
.sjr .p1{ font-size:32px;}
.sjr .p2{ font-size:20px; padding-bottom:30px;}
.sj-ewm{ margin:15px 0 20px 0;}
.sjhide{ display:block;}
.sjshow{ display:none;}
@media only screen and (max-width:720px) and (min-width:0px){
.sj{ display:none;}
.sj-sjcase{ display:block;}	

.sjhide{ display:none;}
.sjshow{ display:block;}
}

/*fast*/
.fastmsgbox{width:1000px; height:560px; display:none; padding:4em; background:rgba(255,255,255,0.98);*background:#FFF; font-size:14px; color:#666;}
.fastmsgbox .msg_zixun{width:49.9%; float:left;}
.fastmsgbox h3{ font-size:3.5em; padding:0 0 0px; line-height:1.3;color:#333;}
.fastmsgbox p{ font-size:1.2em; padding:0 0 0em;}
.fastmsgbox h4{font-size:1.6em; padding:1em 0 0.5em;color:#333;}
.fastmsgbox .msg_zixun input,.fastmsgbox .msg_zixun textarea{font-size:1.2em; padding:1em; border:1px solid #DDD; width:99%; margin-bottom:0.5em;}
.fastmsgbox .msg_zixun textarea{height:5.2em;}
.fastmsgbox .msg_zixun input.submit{font-size:1.2em; padding:1em 0.8em; background:#0078D7; color:#FFF; border:1px solid #0078D7; width:99%; cursor:pointer;}
.fastmsgbox .msg_zixun input.submit:hover{ background:#49D160;border:1px solid #49D160; }
.fastmsgbox .msg_zixun img{float:left; margin-right:1.2em;}
.fastmsgbox .msg_zixun em{font-size:1.2em;}
.fastmsgbox .msg_zixun i{font-size:1.2em; padding:2em 0 0; font-weight:bold; display:inline-block;}